<template>
	<view class="index-page" :style="loading ? 'opacity: 0;' : 'opacity: 1;'">
		<!--  v-model="dataList" @query="queryList" -->
		<pageTxt>
			<view ref="navbar" class="navbar">
				<u-navbar leftIcon=" " :fixed="false">
					<template slot="center">
						<image src="/static/logo.png" class="logo-icon" mode="widthFix"></image>
					</template>
				</u-navbar>
			</view>
			<view class="tab-box">
				<u-tabs
					:list="tabList"
					:lineColor="`url(${icon}) 100% 100%`"
					inactiveStyle="font-weight: 400;font-size: 32rpx;color: #6A6666;"
					activeStyle="font-weight: 500;font-size: 40rpx;color: #000000;"
					@click="tabClickFunc"
					:current="tabIndex"
				></u-tabs>
			</view>
			<!-- { height: 'calc(100vh - ' + topHeight + 'px);' } -->
			<view class="contnet" :style="{ height: Height + 'px' }">
				<z-paging ref="paging" :fixed="false" v-model="dataList" @query="queryList">
					<template slot="empty">
						<u-empty icon="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/no-msg2.png" text=" "></u-empty>
					</template>
					<view class="list-items" v-for="(item, index) in dataList" :key="index" v-if="!dataLoad" @click="jumpHandle(item, index)">
						<template v-if="tabIndex === 0 || tabIndex === 1">
							<view class="db-title-box flex ac jb">
								<view class="title u-line-1">{{ item.project_name }}</view>
							</view>
							<view class="list-items-item list-items-item-width50 flex ac" v-if="tabIndex == 0">
								<view class="title">对应进度</view>
								<!-- 项目 -->
								<view class="desc u-line-1" v-if="item.type == 1">
									<span v-if="item.object_status == 10">待启动</span>
									<span v-if="item.object_status == 15">待勘场</span>
									<span v-if="item.object_status == 18">待勘场出图</span>
									<span v-if="item.object_status == 20">出图中</span>
									<span v-if="item.object_status == 25">待报价</span>
									<span v-if="item.object_status == 30">洽谈中</span>
									<span v-if="item.object_status >= 40">已签约</span>
									<span v-if="item.object_status == 42">-待进场</span>
									<span v-if="item.object_status == 45">-施工中</span>
									<span v-if="item.object_status == 50">-已完工</span>
									<span v-if="item.object_status == 55">-待结算</span>
									<span v-if="item.object_status == 60">-款项付清</span>
								</view>
								<!-- 增减项 -->
								<template v-if="item.type == 2">
									<view class="desc u-line-1" v-if="item.object_status == 10">等待报价</view>
									<view class="desc u-line-1" v-if="item.object_status == 20">等待审核</view>
									<view class="desc u-line-1" v-if="item.object_status == 30">等待二审</view>
									<view class="desc u-line-1" v-if="item.object_status == 40">等待三审</view>
									<view class="desc u-line-1" v-if="item.object_status == 50">已支付,待确认</view>
									<view class="desc u-line-1" v-if="item.object_status == 60">已完成</view>
								</template>
								<!-- 售后 -->
								<template v-if="item.type == 3">
									<view class="desc u-line-1" v-if="item.object_status == 10">待派单</view>
									<view class="desc u-line-1" v-if="item.object_status == 20">待分配</view>
									<view class="desc u-line-1" v-if="item.object_status == 30">待现场确认</view>
									<view class="desc u-line-1" v-if="item.object_status == 40">待总部确认</view>
									<view class="desc u-line-1" v-if="item.object_status == 50">售后施工中</view>
									<view class="desc u-line-1" v-if="item.object_status == 60">售后完成</view>
								</template>
								<!-- 优惠 -->
								<template v-if="item.type == 4">
									<view class="desc u-line-1" v-if="item.object_status == 10">待客户总监审核</view>
									<view class="desc u-line-1" v-if="item.object_status == 20">待总经理审核</view>
								</template>
								<!-- 施工 -->
								<template v-if="item.type == 5">
									<view class="desc u-line-1" v-if="item.object_status == 30">待进场</view>
									<view class="desc u-line-1" v-if="item.object_status == 35">待分配工程经理</view>
									<view class="desc u-line-1" v-if="item.object_status == 40 || item.object_status == 42">待开工</view>
									<view class="desc u-line-1" v-if="item.object_status == 45">施工中</view>
									<view class="desc u-line-1" v-if="item.object_status == 50">已完工</view>
									<view class="desc u-line-1" v-if="item.object_status == 60">质保中</view>
									<view class="desc u-line-1" v-if="item.object_status == 70">质保到期</view>
								</template>
								<!-- 收款单 -->
								<template v-if="item.type == 6">
									<view class="desc u-line-1" v-if="item.object_status == 1">提交勘场费用信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 2">提交预付款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 3">提交进度款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 4">提交尾款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 5">提交增项款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 6">提交定金信息</view>
								</template>
								<!-- 付款单 -->
								<template v-if="item.type == 7">
									<view class="desc u-line-1" v-if="item.object_status == 1">提交工程款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 2">提交供应商货款信息</view>
									<view class="desc u-line-1" v-if="item.object_status == 3">提交装修退款信息</view>
								</template>
								<!-- 整改单 -->
								<template v-if="item.type == 8">
									<view class="desc u-line-1" v-if="item.object_status == 3000">待交整改</view>
									<view class="desc u-line-1" v-if="item.object_status == 3002">未通过</view>
									<view class="desc u-line-1" v-if="item.object_status == 3005">待审核</view>
									<view class="desc u-line-1" v-if="item.object_status == 3010">流程结束</view>
								</template>
							</view>
							<view class="list-items-item list-items-item-width50 flex ac">
								<view class="title">项目编号</view>
								<view class="desc u-line-1">{{ item.project_number }}</view>
							</view>
							<view class="list-items-item list-items-item-width50 flex ac" v-if="tabIndex == 0">
								<view class="title">待办类型</view>
								<view class="desc u-line-1" v-if="item.type == 1">项目</view>
								<view class="desc u-line-1" v-if="item.type == 2">增减项</view>
								<view class="desc u-line-1" v-if="item.type == 3">售后</view>
								<view class="desc u-line-1" v-if="item.type == 4">优惠审批</view>
								<view class="desc u-line-1" v-if="item.type == 5">施工</view>
								<view class="desc u-line-1" v-if="item.type == 6">收款单</view>
								<view class="desc u-line-1" v-if="item.type == 7">付款单</view>
								<view class="desc u-line-1" v-if="item.type == 8">整改单</view>
							</view>
							<view class="list-items-item list-items-item-width50 flex ac" v-if="tabIndex == 1">
								<view class="title">客户名称</view>
								<view class="desc u-line-1">{{ item.name }}</view>
							</view>
							<view class="list-items-item list-items-item-width50 flex">
								<view class="title">操作描述</view>
								<view class="desc" v-if="tabIndex == 0">{{ speedDesc(item) }}</view>
								<view class="desc" v-else>{{ item.content }}</view>
							</view>
						</template>
						<template v-if="tabIndex === 2 || tabIndex === 3">
							<view class="msg-box flex ac" :style="{ opacity: item.is_read == 1 ? 1 : 0.65 }">
								<image class="avater-box" :src="item.send_user_image" mode="aspectFill"></image>
								<view class="msg-data">
									<view class="msg-data-title flex ac jb">
										<view class="flex ac jb">
											<view class="tips-box" v-if="item.is_read == 1"></view>
											<view class="user-name">{{ item.send_user_name }}</view>
										</view>
										<view class="time">{{ item.created_at }}</view>
									</view>
									<view class="msg-data-desc u-line-2">[{{ item.project_name }}] {{ item.content }}</view>
								</view>
							</view>
						</template>
					</view>
				</z-paging>
			</view>
			<view class="tabbar">
				<tabbar></tabbar>
			</view>
		</pageTxt>
	</view>
</template>

<script>
import { handleSpeedDesc } from '@/utils/desc.js';
import { msgJump, toDoJump } from '@/utils/jump.js';

export default {
	data() {
		return {
			icon: require('../../static/images/tabicon.png'),
			loading: true,
			dataLoad: true,
			Height: 0,
			tabIndex: 0,

			projectLogList: [],

			tabList: [
				{
					name: '待办'
				},
				{
					name: '已办'
				},
				{
					name: '抄送',
					badge: {
						value: 0
					}
				},
				{
					name: '消息',
					badge: {
						value: 0
					}
				}
			],
			dataList: []
		};
	},
	computed: {
		speedDesc() {
			return (item) => {
				if (item.type == 1 || item.type == 5) {
					return item.current_node;
				}
				if (item.type == 3) {
					item.after_sales_status = item.object_status;
				} else if (item.type == 2) {
					item.change_status = item.object_status;
				}
				return handleSpeedDesc(item.type, item, uni.getStorageSync('userInfo'));
			};
		}
	},
	onLoad() {
		setTimeout(() => {
			this.getHeight();
		}, 300);
		uni.hideTabBar();
	},
	onShow() {
		this.$refs.paging.reload();
	},
	mounted() {
		uni.hideTabBar();
		this.getData();
	},
	methods: {
		getHeight() {
			// 创建节点查询
			let that = this;
			// this.screenWidth = systemInfo.windowWidth; // 屏幕可用宽度（逻辑像素）
			// this.screenHeight = systemInfo.windowHeight; // 屏幕可用高度（逻辑像素）
			const systemInfo = uni.getSystemInfoSync();
			const query = uni.createSelectorQuery().in(that);
			query.select('.navbar').boundingClientRect();
			query.select('.tabbar').boundingClientRect();
			query.select('.tab-box').boundingClientRect();
			query.exec((res) => {
				that.Height = systemInfo.windowHeight - (res[0].height + res[1].height + res[2].height + 20); // + 20 + res[1].height + systemInfo.statusBarHeight
				console.log(that.Height, 'that.Height');
				setTimeout(() => {
					that.loading = false;
				}, 0);
			});
		},
		getData() {
			// 获取已办数据
			this.$hApi
				.getProjectLogNew({
					handlers_id: uni.getStorageSync('userInfo').id
				})
				.then((res) => {
					console.log(res, 'getProjectLogNew');
					if (res.code == 200) {
						this.projectLogList = res.data;
					}
				});
			// 获取抄送/消息数量
			this.$hApi
				.getMessageList({
					page: 1,
					num: 1
				})
				.then((res) => {
					console.log(res, 'getMessageList');
					if (res.code == 200) {
						this.tabList[2].badge.value = res.data.carbon_copy_unread_message_number;
						this.tabList[3].badge.value = res.data.unread_message_number;
					}
				});
		},
		queryList(page, num) {
			let arr = [this.$hApi.pendingOperationList, null, this.$hApi.getMessageList, this.$hApi.getMessageList];
			let param = [
				{
					page,
					num
				},
				{},
				{
					page,
					num,
					carbon_copy: 1
				},
				{
					page,
					num,
					carbon_copy: 2
				}
			];
			let tabIndex = this.tabIndex;
			if (arr[tabIndex]) {
				arr[tabIndex](param[tabIndex]).then((res) => {
					console.log(res);
					if (res.code == 200) {
						if (tabIndex >= 2) {
							this.$refs.paging.complete(res.data.list);
							this.tabList[2].badge.value = res.data.carbon_copy_unread_message_number;
							this.tabList[3].badge.value = res.data.unread_message_number;
						} else {
							this.$refs.paging.complete(res.data);
						}
					} else {
						this.$refs.paging.complete([]);
					}
				});
				this.dataLoad = false;
			} else {
				this.$refs.paging.setLocalPaging(this.projectLogList);
				this.dataLoad = false;
			}
		},
		// tab
		tabClickFunc(e) {
			console.log(e);
			this.dataLoad = true;
			this.dataList = [];
			this.tabIndex = e.index;
			this.$refs.paging.reload();
		},

		// 跳转处理
		jumpHandle(item, index) {
			let tabIndex = this.tabIndex;
			// 消息
			if (tabIndex == 2 || tabIndex == 3) {
				let path = msgJump(item);
				console.log('消息和抄送', item, path);
				if (item.is_read == 1) {
					this.$Api
						.readMessage({
							message_id_arr: [item.id]
						})
						.then((res) => {
							console.log(res, 'readMessage');
							if (res.code == 200) {
								this.dataList[index].is_read = 2;
								this.tabList[tabIndex].badge.value -= 1;
								// 跳转处理
								uni.navigateTo({
									url: path
								});
							}
						});
				} else {
					uni.navigateTo({
						url: path
					});
				}
			} else if (tabIndex == 1) {
				// 跳转处理
				uni.navigateTo({
					url: '/pagesB/projectDetail/projectDetail?id=' + item.project_id
				});
			} else {
				let path = toDoJump(item);
				console.log('待办', item, path);
				uni.navigateTo({
					url: path
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
@import 'index.scss';
</style>
